<%--
    Document   : admin02
    Created on : 02-Aug-2013, 16:13:04
    Author     : Minh Quyen
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Administration|Lafitte</title>

        <!--Popup-->
        <style>
            .popup{
                position: absolute;
                background: white;
                border: 1px solid gray;
                z-index: 10000;
                box-shadow: 3px 3px gray;
            }
            #background{
                position: absolute;
                background: gray;
                left: 0px;
                top: 0px;
            }
            a.close{
                text-decoration: none;
                float: right;
            }
        </style>

        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
        <script>
            $(document).ready(function() {
                $(".popup").hide();

                $(".close").click(function (e) {
                    closePopup();
                    e.preventDefault();
                });

                $("#background").click(function () {
                    closePopup();
                });

            });

            function openPopupS(fullname,address,telephone,email,cardId,point,rank,id,job,bankAccount,bankName,isBlock,isLost,username,dob){
                document.getElementById("fullnameP").value = fullname;
                document.getElementById("addressP").value = address;
                document.getElementById("telephoneP").value = telephone;
                document.getElementById("emailP").value = email;
                document.getElementById("cardIdP").value = cardId;
                document.getElementById("pointP").value = point;
                document.getElementById("rankP").value = rank;
                document.getElementById("idP").value = id;
                document.getElementById("jobP").value = job;
                document.getElementById("bankAccountP").value = bankAccount;
                document.getElementById("bankNameP").value = bankName;
                document.getElementById("usernameP").innerHTML = username;
                document.getElementById("usernamePt").value = username;
                document.getElementById("usernamePt").value = username;

                var date=new Date(dob);
                document.getElementById("dobP").value = date.getMonth()+'/'+date.getDate()+'/'+date.getFullYear();
                if(isBlock=="true"){
                    document.getElementById("isBlockP").checked=true;
                }else{
                    document.getElementById("isBlockP").checked=false;
                }
                if(isLost=="true"){
                    document.getElementById("isLostP").checked=true;
                }else{
                    document.getElementById("isLostP").checked=false;
                }

                var dheight = $(document).height();
                var dwidth = $(document).width();

                $("#background").width(dwidth).height(dheight);

                $("#background").fadeTo("slow",0.8);

                var $popup1=$("#popup1");
                $popup1.css("top", (dheight-$popup1.height())/2);
                $popup1.css("left",(dwidth-$popup1.width())/2);

                $popup1.fadeIn();
            }

            function openPopupR(fullname,address,telephone,email,cardId,point,rank,id,job,bankAccount,bankName,isBlock,isLost,username,dob){
                document.getElementById("fullnameP3").value = fullname;
                document.getElementById("addressP3").value = address;
                document.getElementById("telephoneP3").value = telephone;
                document.getElementById("emailP3").value = email;
                document.getElementById("cardIdP3").value = cardId;
                document.getElementById("pointP3").value = point;
                document.getElementById("rankP3").value = rank;
                document.getElementById("idP3").value = id;
                document.getElementById("jobP3").value = job;
                document.getElementById("bankAccountP3").value = bankAccount;
                document.getElementById("bankNameP3").value = bankName;
                document.getElementById("usernameP3").innerHTML = username;
                document.getElementById("usernamePt3").value = username;
                if(isBlock=="true"){
                    document.getElementById("isBlockP3").checked=true;
                }else{
                    document.getElementById("isBlockP3").checked=false;
                }
                if(isLost=="true"){
                    document.getElementById("isLostP3").checked=true;
                }else{
                    document.getElementById("isLostP3").checked=false;
                }
                var date=new Date(dob);
                document.getElementById("dobP3").value = date.getMonth()+'/'+date.getDate()+'/'+date.getFullYear();

                var dheight = $(document).height();
                var dwidth = $(document).width();

                $("#background").width(dwidth).height(dheight);

                $("#background").fadeTo("slow",0.8);

                var $popup3=$("#popup3");
                $popup3.css("top", (dheight-$popup3.height())/2);
                $popup3.css("left",(dwidth-$popup3.width())/2);

                $popup3.fadeIn();
            }

            function openPopup2(fullname,address,telephone,email,id,job,bankAccount,bankName,username,dob){
                document.getElementById("fullnameP2").value = fullname;
                document.getElementById("addressP2").value = address;
                document.getElementById("telephoneP2").value = telephone;
                document.getElementById("emailP2").value = email;
                document.getElementById("idP2").value = id;
                document.getElementById("jobP2").value = job;
                document.getElementById("bankAccountP2").value = bankAccount;
                document.getElementById("bankNameP2").value = bankName;
                document.getElementById("usernameP2").innerHTML = username;
                document.getElementById("usernamePt2").value = username;
                var date=new Date(dob);
                document.getElementById("dobP2").value = date.getMonth()+'/'+date.getDate()+'/'+date.getFullYear();

                var dheight = $(document).height();
                var dwidth = $(document).width();

                $("#background").width(dwidth).height(dheight);

                $("#background").fadeTo("slow",0.8);

                var $popup2=$("#popup2");
                $popup2.css("top", (dheight-$popup2.height())/2);
                $popup2.css("left",(dwidth-$popup2.width())/2);

                $popup2.fadeIn();
            }
            function closePopup(){
                $("#background").fadeOut();
                $(".popup").hide();
            }

            function validateCardId(value) {
                if (value.value.length == 0) {
                    document.getElementById("cardIdError").innerHTML='CardId is required!';
                    document.getElementById("cardIdError1").innerHTML='CardId is required!';
                    return false;
                }
                document.getElementById("cardIdError").innerHTML='';
                document.getElementById("cardIdError1").innerHTML='';
                return true;
            }

            function validateInt(value) {
                var intRegex = /^\d+$/;
                if(intRegex.test(value.value)==false) {
                    document.getElementById("pointError").innerHTML='Point is an integer!';
                    document.getElementById("pointError1").innerHTML='Point is an integer!';
                    return false;
                }
                document.getElementById("pointError").innerHTML='';
                document.getElementById("pointError1").innerHTML='';
                return true;
            }
        </script>
    </head>
    <body style="background-image: url('images2/admin.jpg')">
        <jsp:include page="adminheader.jsp"/>
        <div class="container-fluid">
            <div class="row-fluid">
                <div class="span2">
                    <jsp:include page="adminnavbar.jsp" />
                </div>
                <div class="span10" align="right">
                    <form class="form-search alert-success" action="Admin" method="POST">
                        <input type="text" class="input-large search-query" placeholder="Full name ..."
                               name="txtSearch" value="${param.txtSearch}">
                        <button type="submit" class="btn btn-inverse" name="btAction" value="Search">Search</button>
                    </form>
                    <hr>

                    <c:set var="search" value="${param.txtSearch}"/>
                    <c:if test="${not empty search}">
                        <!--ko co-->
                        <c:if test="${empty CUSLIST}">
                            Can't find any customer has full name like ${param.txtSearch}
                        </c:if>

                        <!--co-->
                        <c:if test="${not empty CUSLIST}">
                            <table class="table table-hover">
                                <tr>
                                    <th>No.</th>
                                    <th>Username</th>
                                    <th>Full name</th>
                                    <th>Card ID</th>
                                    <th>Block card</th>
                                    <th>Lost card</th>
                                    <th></th>
                                </tr>
                                <c:forEach var="cus" items="${CUSLIST}" varStatus="counter">
                                    <form action="Admin" method="POST">
                                        <tr class="warning">
                                            <td>${counter.count}</td>
                                            <td>
                                                ${cus.username}
                                                <input type="hidden" name="txtUsername" value="${cus.username}"/>
                                                <input type="hidden" name="txtSearch" value="${search}" />
                                            </td>
                                            <td>${cus.fullname}</td>
                                            <td>${cus.customers.cardId}</td>
                                            <td align="center">
                                                <c:if test="${not cus.customers.isBlock}">
                                                    <button type="submit" class="btn btn-inverse" name="btAction" value="Block">Block</button>
                                                </c:if>
                                                <c:if test="${cus.customers.isBlock}">
                                                    <button type="submit" class="btn btn-inverse" name="btAction" value="UnBlock">Unblock</button>
                                                </c:if>
                                            </td>
                                            <td align="center">
                                                <c:if test="${not cus.customers.isLost}">
                                                    <button type="submit" class="btn btn-inverse" name="btAction" value="Lost">Lost</button>
                                                </c:if>
                                                <c:if test="${cus.customers.isLost}">
                                                    <button type="submit" class="btn btn-inverse" name="btAction" value="NotLost">Not lost</button>
                                                </c:if>
                                            </td>
                                            <td align="center">
                                                <a onclick="openPopupS('${cus.fullname}','${cus.address}','${cus.telephone}',
                                                    '${cus.email}','${cus.customers.cardId}','${cus.customers.point}',
                                                    '${cus.customers.rank}','${cus.customers.id}','${cus.customers.job}',
                                                    '${cus.customers.bankAccount}','${cus.customers.bankName}',
                                                    '${cus.customers.isBlock}','${cus.customers.isLost}','${cus.username}','${cus.customers.dateOfBirth}')">
                                                    View</a>
                                            </td>
                                        </tr>
                                    </form>
                                </c:forEach>
                            </table>
                        </c:if>
                    </c:if>

                    <!--pending-->
                    <c:if test="${not empty PENDING}">
                        <table class="table table-hover">
                            <tr>
                                <th>No.</th>
                                <th>Username</th>
                                <th>Full name</th>
                                <th>ID</th>
                                <th></th>
                                <th></th>
                            </tr>
                            <c:forEach var="cus" items="${PENDING}" varStatus="counter">
                                <form action="Admin" method="POST">
                                    <tr class="warning">
                                        <td>${counter.count}</td>
                                        <td>
                                            ${cus.username}
                                            <input type="hidden" name="txtUsername" value="${cus.username}"/>
                                        </td>
                                        <td>${cus.fullname}</td>
                                        <td>${cus.customers.id}</td>
                                        <td>
                                            <button type="submit" class="btn btn-inverse" name="btAction" value="Approve">Approve</button>
                                            <button type="submit" class="btn btn-inverse" name="btAction" value="Disapprove">Disapprove</button>
                                        </td>
                                        <td align="center">
                                            <a onclick="openPopup2('${cus.fullname}', '${cus.address}', '${cus.telephone}', '${cus.email}',
                                                '${cus.customers.id}', '${cus.customers.job}', '${cus.customers.bankAccount}',
                                                '${cus.customers.bankName}', '${cus.username}','${cus.customers.dateOfBirth}')">View</a>
                                        </td>
                                    </tr>
                                </form>
                            </c:forEach>
                        </table>
                    </c:if>

                    <!--report-->
                    <c:if test="${not empty REPORT}">
                        <table class="table table-hover">
                            <tr>
                                <th>No.</th>
                                <th>Username</th>
                                <th>Full name</th>
                                <th>Card ID</th>
                                <th>Block card</th>
                                <th>Lost card</th>
                                <th></th>
                            </tr>
                            <c:forEach var="cus" items="${REPORT}" varStatus="counter">
                                <form action="Admin" method="POST">
                                    <tr class="warning">
                                        <td>${counter.count}</td>
                                        <td>
                                            ${cus.username}
                                            <input type="hidden" name="txtUsername" value="${cus.username}" id="username"/>
                                            <input type="hidden" name="txtSearch" value="${search}" />
                                        </td>
                                        <td>${cus.account.fullname}</td>
                                        <td>${cus.cardId}</td>
                                        <td align="center">
                                            <c:if test="${not cus.isBlock}">
                                                <button type="submit" class="btn btn-inverse" name="btAction" value="Block">Block</button>
                                            </c:if>
                                            <c:if test="${cus.isBlock}">
                                                <button type="submit" class="btn btn-inverse" name="btAction" value="UnBlock">Unblock</button>
                                            </c:if>
                                            <input type="hidden" name="" value="${cus.isBlock}" id="isBlock" />
                                        </td>
                                        <td align="center">
                                            <c:if test="${not cus.isLost}">
                                                <button type="submit" class="btn btn-inverse" name="btAction" value="Lost">Lost</button>
                                            </c:if>
                                            <c:if test="${cus.isLost}">
                                                <button type="submit" class="btn btn-inverse" name="btAction" value="NotLost">Not lost</button>
                                            </c:if>
                                        </td>
                                        <td align="center">
                                            <a onclick="openPopupR('${cus.account.fullname}','${cus.account.address}','${cus.account.telephone}',
                                                '${cus.account.email}','${cus.cardId}','${cus.point}',
                                                '${cus.rank}','${cus.id}','${cus.job}',
                                                '${cus.bankAccount}','${cus.bankName}',
                                                '${cus.isBlock}','${cus.isLost}','${cus.username}','${cus.dateOfBirth}')">
                                                View</a>
                                        </td>
                                    </tr>
                                </form>
                            </c:forEach>
                        </table>
                    </c:if>
                </div>

                <!-- POPUP CONTENT 1 -->
                <div id="popup1" class="popup" style="width:700px;height:500px;">
                    <form action="Admin" method="POST">
                        <div style="background:lavender;">
                            Customer: <strong id="usernameP"></strong>
                            <input type="hidden" name="txtUsername" value="" id="usernamePt"/>
                            <input type="hidden" name="txtSearch" value="${search}" />
                            <a href="#" class="close">x</a>
                        </div>
                        <div align="center" style="margin-top:20px">
                            <table border="0">
                                <tr>
                                    <td>Full name: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="fullnameP"/> </td>
                                    <td>Card Id: </td>
                                    <td><input type="text" name="txtCardId" value="" id="cardIdP" onblur="validateCardId(this);"/> </td>
                                    <td><label style="color: red" id="cardIdError"></label> </td>
                                </tr>
                                <tr>
                                    <td>Date of birth: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="dobP"/> </td>
                                    <td>Point: </td>
                                    <td><input type="text" name="txtPoint" value="" id="pointP" onblur="validateInt(this);"/> </td>
                                    <td><label style="color: red" id="pointError"></label> </td>
                                </tr>
                                <tr>
                                    <td>Address: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="addressP"/> </td>
                                    <td>Rank: </td>
                                    <td><select name="ddlRank" id="rankP">
                                            <option>Regular</option>
                                            <option>Silver</option>
                                            <option>Gold</option>
                                        </select> </td>
                                </tr>
                                <tr>
                                    <td>Telephone: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="telephoneP"/> </td>
                                    <td>Block: </td>
                                    <td>
                                        <input type="checkbox" name="cbBlock" value="ON" id="isBlockP"
                                               <c:if test="${param.txtBlock}">checked</c:if>/>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Email: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="emailP"/> </td>
                                    <td>Lost: </td>
                                    <td><input type="checkbox" name="cbLost" value="ON" id="isLostP"/></td>
                                </tr>
                                <tr>
                                    <td>Id: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="idP"/> </td>
                                </tr>
                                <tr>
                                    <td>Job: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="jobP"/> </td>
                                </tr>
                                <tr>
                                    <td>Bank Account: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="bankAccountP"/> </td>
                                </tr>
                                <tr>
                                    <td>Bank name: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="bankNameP"/> </td>
                                    <td></td>
                                    <td align="right">
                                        <button type="submit" class="btn btn-inverse" name="btAction" value="SaveSearch">Save</button>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </form>
                    <!-- END POPUP CONTENT -->
                </div>

                <!-- POPUP CONTENT report -->
                <div id="popup3" class="popup" style="width:700px;height:500px;">
                    <form action="Admin" method="POST">
                        <div style="background:lavender;">
                            Customer: <strong id="usernameP3"></strong>
                            <input type="hidden" name="txtUsername" value="" id="usernamePt3"/>
                            <a href="#" class="close">x</a>
                        </div>
                        <div align="center" style="margin-top:20px">
                            <table border="0">
                                <tr>
                                    <td>Full name: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="fullnameP3"/> </td>
                                    <td>Card Id: </td>
                                    <td><input type="text" name="txtCardId" value="" id="cardIdP3" onblur="validateCardId(this);"/> </td>
                                    <td><label style="color: red" id="cardIdError1"></label> </td>
                                </tr>
                                <tr>
                                    <td>Date of birth: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="dobP3"/> </td>
                                    <td>Point: </td>
                                    <td><input type="text" name="txtPoint" value="" id="pointP3" onblur="validateInt(this);"/> </td>
                                    <td><label style="color: red" id="pointError1"></label> </td>
                                </tr>
                                <tr>
                                    <td>Address: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="addressP3"/> </td>
                                    <td>Rank: </td>
                                    <td><select name="ddlRank" id="rankP3">
                                            <option>Regular</option>
                                            <option>Silver</option>
                                            <option>Gold</option>
                                        </select> </td>
                                </tr>
                                <tr>
                                    <td>Telephone: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="telephoneP3"/> </td>
                                    <td>Block: </td>
                                    <td><input type="checkbox" name="cbBlock" value="ON" id="isBlockP3"/></td>
                                </tr>
                                <tr>
                                    <td>Email: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="emailP3"/> </td>
                                    <td>Lost: </td>
                                    <td><input type="checkbox" name="cbLost" value="ON" id="isLostP3"/></td>
                                </tr>
                                <tr>
                                    <td>Id: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="idP3"/> </td>
                                </tr>
                                <tr>
                                    <td>Job: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="jobP3"/> </td>
                                </tr>
                                <tr>
                                    <td>Bank Account: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="bankAccountP3"/> </td>
                                </tr>
                                <tr>
                                    <td>Bank name: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="bankNameP3"/> </td>
                                    <td></td>
                                    <td align="right">
                                        <button type="submit" class="btn btn-inverse" name="btAction" value="SaveReport">Save</button>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </form>
                    <!-- END POPUP CONTENT -->
                </div>

                <!-- POPUP CONTENT 2 -->
                <div id="popup2" class="popup" style="width:700px;height:400px;">
                    <form action="Admin" method="POST">
                        <div style="background:lavender;">
                            Customer: <strong id="usernameP2"></strong>
                            <input type="hidden" name="txtUsername" value="" id="usernamePt2"/>
                            <a href="#" class="close">x</a>
                        </div>
                        <div align="center" style="margin-top:20px">
                            <table border="0">
                                <tr>
                                    <td>Full name: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="fullnameP2"/> </td>
                                    <td>Date of birth: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="dobP2"/> </td>
                                </tr>
                                <tr>
                                    <td>Telephone: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="telephoneP2"/> </td>
                                    <td>Email: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="emailP2"/> </td>
                                </tr>
                                <tr>
                                    <td>Id: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="idP2"/> </td>
                                    <td>Job: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="jobP2"/> </td>
                                </tr>
                                <tr>
                                    <td>Bank Account: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="bankAccountP2"/> </td>
                                    <td>Bank name: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="bankNameP2"/> </td>
                                </tr>
                                <tr>
                                    <td>Address: </td>
                                    <td><input type="text" name="" value="" readonly="readonly" id="addressP2"/> </td>
                                </tr>
                                <tr>
                                    <td align="right" colspan="4">
                                        <button type="submit" class="btn btn-inverse" name="btAction" value="Approve">Approve</button>
                                        <button type="submit" class="btn btn-inverse" name="btAction" value="Disapprove">Disapprove</button>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </form>
                    <!-- END POPUP CONTENT -->
                </div>

                <div id="background"></div>
            </div>
        </div>
    </body>
</html>
